<!DOCTYPE html>
<html class="ui-page-login">
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>首页</title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/icons-extra.css" rel="stylesheet" />
		<link href="css/style.css" rel="stylesheet" />
	</head>

	<body>
		<header class="mui-bar mui-bar-transparent linearbg">
			<!--<h1 class="mui-title">惠花</h1>
			<a href="message.html" class="mui-btn mui-btn-link mui-pull-right">
				<span class="mui-icon mui-icon-right-news"></span>
			</a>-->
		</header>
		<!-- 底部跳转  -->
		<nav class="mui-bar mui-bar-tab">
			<a id="Tab1" class="mui-tab-item mui-active" href="#" onclick="_hrerf('Tab1')">
				<span class="mui-icon mui-icon-home"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a id="Tab2" class="mui-tab-item" href="#" onclick="_hrerf('Tab2')"> 
				<span class="mui-icon-extra mui-icon-extra-gold"></span>
				<span class="mui-tab-label">分期</span>
			</a>
			<a id="Tab3" class="mui-tab-item" href="#" onclick="_hrerf('Tab3')">
				<span class="mui-icon-extra mui-icon-extra-peoples"></span>
				<span class="mui-tab-label">我的</span>
			</a>
		</nav>
		<!-- 主要内容 -->
		<div class="mui-content home">			    
		    <!-- 轮播 -->
			<div id="slider" class="mui-slider">
				<div class="mui-slider-group mui-slider-loop" >
					<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="#">
							<img src="images/banner3.png">
						</a>
					</div>
					<!-- 第一张 -->
					<div class="mui-slider-item">
						<a href="#">
							<img src="images/banner1.png">
						</a>
					</div>
					<!-- 第二张 -->
					<div class="mui-slider-item">
						<a href="#">
							<img src="images/banner2.png">
						</a>
					</div>
					<!-- 第三张 -->
					<div class="mui-slider-item">
						<a href="#">
							<img src="images/banner3.png">
						</a>
					</div>				
					<!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
					<div class="mui-slider-item mui-slider-item-duplicate">
						<a href="#">
							<img src="images/banner1.png">
						</a>
					</div>
				</div>
				<div class="mui-slider-indicator">
					<div class="mui-indicator mui-active"></div>
					<div class="mui-indicator"></div>
					<div class="mui-indicator"></div>						
				</div>
			</div>			
			<!-- 列表  -->
			<div id="Gallery" class="mui-slider" >
				<div class="mui-slider-group">
					<div class="mui-slider-item">
						<ul class="mui-table mui-text-center">
					       	<li class="mui-table-cell">
					            <a href="">
					            	<span class="mui-icon mui-icon-appoint"></span>		               
					                <div>分期预约</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					            <a href="" >
					            	<span class="mui-icon mui-icon-apply"></span>		               
					                <div>我要申请</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					           <a href="">
					            	<span class="mui-icon mui-icon-trial"></span>		            	
					                <div>分期试算</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					            <a href="">
					            	<span class="mui-icon mui-icon-repay"></span>		               
					                <div>我要还款</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					            <a href="" >
					            	<span class="mui-icon mui-icon-service"></span>		               
					                <div>奎安延保</div>
					            </a>
					        </li>	
					    </ul>
					    <ul class="mui-table mui-text-center">
					       	<li class="mui-table-cell">
					            <a href="">
					            	<span class="mui-icon mui-icon-appoint"></span>		               
					                <div>分期预约</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					            <a href="" >
					            	<span class="mui-icon mui-icon-apply"></span>		               
					                <div>我要申请</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					           <a href="">
					            	<span class="mui-icon mui-icon-trial"></span>		            	
					                <div>分期试算</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					            <a href="">
					            	<span class="mui-icon mui-icon-repay"></span>		               
					                <div>我要还款</div>
					            </a>
					        </li>
					        <li class="mui-table-cell">
					            <a href="" >
					            	<span class="mui-icon mui-icon-service"></span>		               
					                <div>奎安延保</div>
					            </a>
					        </li>	
					    </ul>
					</div>					
				</div>				
			</div>
			<!-- 活动介绍 -->
			<div class="line"></div>							
			<div class="activity">
				<p class="">活动专区</p>
				<ul class="mui-table-view" id="list">
					<li class="mui-table-view-cell">
						<a href="javascript:;" >
							<img src="images/activity2.png"/>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a href="javascript:;" >
							<img src="images/activity3.png"/>
						</a>
					</li>
					<li class="mui-table-view-cell">
						<a href="javascript:;" >
							<img src="images/activity1.png"/>
						</a>
					</li>
				</ul>
			</div>
		</div>
	</body>
	<script src="js/mui.min.js"></script>
	<script src="js/jquery-1.8.3.min.js"></script>
	<script src="js/commom.base.js"></script>
	<script>
		/*************************** 菜单跳转 ****************************/
		function _hrerf(href) {				
			if(href === "Tab1") {					
				location.href = '';
			}else if(href === "Tab2") {					
				location.href = '';
			} else if(href === "Tab3") {					
				location.href = '';					
			} 
		}				
	</script>
</html>